import BaseView from "../baseview.js";

export default class ShowStudentListView extends BaseView{
      
   constructor(id){
     super(id);
     super.init();
   }

  render(){
        $("#show_content").html(`
        <div style="margin:20px 20px;">
        <span class="layui-breadcrumb">
            <a>学生管理</a>
            <a>学生信息列表</a>
          </span>      
      </div>
      <a style="margin-left: 20px;" class="layui-btn layui-btn-normal" href="#/main/addstudent">
      添加学生<i class="layui-icon layui-icon-user"></i> 
      &nbsp; 
  </a>
    <hr>
     <div>
        <table id="demo" lay-filter="test"></table>
     </div>
        `)
    }
    addlayuiJs(){
     $("#addscript").html(`
     <script type="text/html" id="barDemo">
     <a class="layui-btn layui-btn-xs" lay-event="detail">查看</a>
     <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
     <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
   </script>

     <script>
layui.use('table', function(){
  var table = layui.table;

  //给table绑定事件
  table.on('tool(test)', function(obj){
       //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
      var data = obj.data; //获得当前行数据
      var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
      var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
     
      if(layEvent === 'detail'){ //查看
       
        window.location.hash="#/main/showDetail/"+data._id;
      
      } else if(layEvent === 'del'){ //删除
        layer.confirm('真的删除行么', function(index){
            $.ajax({
              type:"post",
              url:"/api/student/delstudentInfo",
              data:{
                studentid:data._id
              },
              dataType:"json",
              success(data){
                    if(data.deletedCount===1){
                        alert("删除成功");
                        //obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                        layer.close(index);
                        //window.location.reload(true);
                        //如何重新加载数据表格

                    }else{
                      alert("删除失败");
                    }
              }
            })


        
        });
      } else if(layEvent === 'edit'){ //编辑
         window.location.hash="#/main/updatestduent/"+data._id;
      }
    });


  
  //第一个实例
  table.render({
    elem: '#demo'
    ,height: 400
    ,url: '/api/student/showstudentInfosByPage/'
    ,page: true //开启分页
    ,limit:2
    ,limits:[1,2,3,4,5]
    ,parseData:(res)=>{
        return {
            "code": 0, //解析接口状态
            "msg": '', //解析提示文本
            "count": res.tatolNum, //解析数据长度
            "data": res.datas //解析数据列表
          };
    }
    ,request: {
        pageName: 'currentPage' //页码的参数名称，默认：page
        ,limitName: 'pageSize' //每页数据量的参数名，默认：limit
      }
    ,cols: [[ //表头
       {field: '_id', title: '编号', fixed: 'left'}
      ,{field: 'name', title: '学生姓名'}
      ,{field: 'gender', title: '性别' }
      ,{field: 'age', title: '年龄',sort: true} 
      ,{field: 'classid', title: '所在班级',templet:res=>res.classid.name}
      ,{fixed: 'right', align:'center', toolbar: '#barDemo'}  
    ]]
  });
  
});




</script>
     `)
    }

    handle(){

    }

}
